<%@ page language="java" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
<title>赌我会瘦</title>
<%@ include file="/WEB-INF/include/meta.jsp"%>
<%@ include file="/WEB-INF/include/css.jsp"%>
</head>
<!-- end header -->

<body>
  <div class="page-group">
    <div class="page page-current shopping-page bg-light-gray">
      <div class="content">
        <div style="position: relative;">
          <img src="${ctx.resource}/images/welcome-logo.png" style="display: block; width: 6rem; position: absolute; top: 50%; left: 50%; margin-top: -2.5rem; margin-left: -3rem;">
          <img src="${ctx.resource}/images/activity-shopping-banner.png" class="img-style" alt=""/>
        </div>
        <div class="text-center participant-info">
          <img src="${user.avatar}" class="cover">
          <p class="name no-margin">${user.nickname}</p>
          <p class="gender no-margin">${user.gender}</p>
        </div>
        <div class="shopping-list">
          <div class="list-block " style="margin: .5rem 0;">
                    <ul>
                      <li>
                        <div class="item-content">
                          <div class="item-inner">
                            <div class="item-title" style="padding-left: .5rem;">支付金额</div>
                            <div class="item-after color-red">￥200.00</div>
                          </div>
                        </div>
                      </li>
                    </ul>
                  </div>
            <form>
                <div class="list-block no-margin ">
                        <ul>
                          <li>
                            <div class="item-content">
                              <div class="item-inner">
                                <i class="iconfont icon-phone" style="color: #7E7575;"></i>
                                <c:choose>
                                  <c:when test="${not empty user.mobile}">
                                    <div class="item-input">
                                      <input type="text" name="mobile" value="${user.mobile}" style="text-align: right;">
                                    </div>
                                  </c:when>
                                  <c:otherwise>
                                    <div class="item-input">
                                      <input type="text" name="mobile" placeholder="请输入您的手机号">
                                    </div>
                                    <a href="javascript:void(0);" class="get-code color-red">获取验证码</a>
                                  </c:otherwise>
                                </c:choose>
                                
                              </div>
                            </div>
                          </li>
                          <!-- <li>
                            <div class="item-content">
                              <div class="item-inner">
                                <i class="iconfont icon-captcha"></i>
                                <div class="item-input">
                                  <input type="text" name="code" placeholder="请输入收到的验证码">
                                </div>
                              </div>
                            </div>
                          </li> -->
                        </ul>
                      </div>
                      <a href="javascript:void(0);" id="submit" data-href="activity-shopping/result?userActivityId=1&orderId=1" class="button fb-button button-big wechat-pay-button"><i class="iconfont icon-wechat"></i>&nbsp;微信支付</a>
                    </form>
                </div>
        <%-- <div class="content-padded">
          <h1>参赛者支付.jpg</h1>
        </div>
        <div class="content-block">
          <p><a href="${ctx.host}/activity-shopping/result?userActivityId=1&orderId=1" class="button button-big">微信支付</a></p>
        </div> --%>
      </div>
    </div>
  </div>
  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource type="script" root="${ctx.resource}/build" src="js/page/bet-shopping/shopping-index.js" />
  <script type="text/javascript">
    require(['page/bet-shopping/shopping-index'], function(page) {
      page.init({
        "jsConfig": JSON.parse('${jsConfig}'),
        "unionid": '${user.unionid}',
        "userId": '${user.id}',
        "betId": '${betId}',
        "avatar": '${user.avatar}'
      })
    })
  </script>
  
</body>
</html>